<html lang="en-US">
    <head>
        <title>ARIA 1.2 Example</title>
    </head>
    <body>
        <main>
            <div>
                Sample from <a href="https://w3c.github.io/aria-practices/examples/combobox/combobox-select-only.html">ARIA 1.2 Practices</a>
            </div>
            <label id="combo1-label" class="combo-label">
                Favorite Fruit
            </label>
            <div class="combo js-select">
                <div aria-controls="listbox1"
                    aria-expanded="true"
                    aria-haspopup="listbox"
                    aria-labelledby="combo1-label"
                    id="combo1"
                    class="combo-input"
                    role="combobox"
                    tabindex="0"
                    aria-activedescendant="op1">
                </div>
                <div class="combo-menu"
                    role="listbox"
                    id="listbox1"
                    aria-labelledby="combo1-label"
                    tabindex="-1">
                    <div role="option" id="op1" aria-selected="true">option text</div>
                </div>
            </div>
        </main>
        <script>
            UnitTest = {
                ruleIds: ["combobox_active_descendant"],
                results: [{
                    "ruleId": "combobox_active_descendant",
                    "value": [
                    "INFORMATION",
                    "PASS"
                    ],
                    "path": {
                    "dom": "/html[1]/body[1]/main[1]/div[2]/div[1]",
                    "aria": "/document[1]/main[1]/combobox[1]"
                    },
                    "reasonId": "Pass",
                    "message": "'aria-activedescendant' is used appropriately for this combobox",
                    "messageArgs": [],
                    "apiArgs": [],
                    "category": "Accessibility"
                }]
            }
        </script>
    </body>
</html>